<template>
  <div class="content-block content-line">
    <el-scrollbar style="height: 100%">
      <div class="content-main">
        <div class="content-title">
          <div class="title-text">系统设置</div>
        </div>
        <div class="system-set" v-if="settingForm!={}">
          <el-form ref="settingForm" :model="settingForm" label-width="180px" size="small">
            <div v-for="item in settingForm" :key="item.settingId">
              <el-form-item v-if="item.settingType==='T'" :label="item.settingName">
                <el-input v-if="!selectArray.includes(item.settingId)" v-model="item.value"></el-input>
                <el-select v-else v-model="item.value" filterable>
                  <el-option v-for="option of modelList" :key="option.id" :value="option.key" :label="option.name"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item v-if="item.settingType==='R'" :label="item.settingName">
                <el-col :span="11">
                  <el-input style="width: 100%;" v-model="item.startValue"></el-input>
                </el-col>
                <el-col class="line" :span="2" style="text-align: center;">&nbsp;——————&nbsp;</el-col>
                <el-col :span="11">
                  <el-input style="width: 100%;" v-model="item.endValue"></el-input>
                </el-col>
              </el-form-item>
              <el-form-item v-if="item.settingType==='S'" :label="item.settingName">
                <el-radio-group v-model="item.currentValueId">
                  <el-radio
                    v-for="it in item.allValues"
                    :label="it.valueId"
                    :key="it.valueId">{{it.settingValue}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item v-if="item.settingType==='C'" :label="item.settingName">
                <el-checkbox-group v-model="item.currentValueIds">
                  <el-checkbox v-for="it in item.allValues" :label="it.valueId" :key="it.valueId">
                    {{it.settingValue}}
                  </el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </div>
          </el-form>
          <div style="text-align: center;">
            <el-button type="primary" size="mini" @click="settingSubmit">提交</el-button>
          </div>
        </div>
      </div>
    </el-scrollbar>
  </div>
</template>

<script>
  import {mapActions, mapState} from 'vuex'

  export default {
    data() {
      return {
        settingForm: {},
        selectArray: ['charge_account_approve_id', 'contract_approve_id', 'contract_change_approve_id', 'pay_apply_id', 'pay_id', 'phase_report_id'],
        current: 1,
        pageSize: 1000,
      }
    },
    computed: {
      ...mapState({
        modelList: state => state.flowModel.modelList
      })
    },
    mounted() {
      this.getData()
    },
    methods: {
      ...mapActions('systemSet', ['getSettingData', 'updateSettings']),
      // ...mapActions('flowModel', ['getModelList']),
      getData() {
        const vm = this
        vm.getSettingData(vm)
        // vm.getModelList(vm)
      },
      settingSubmit() {
        const vm = this
        vm.updateSettings(vm)
      }
    }
  }
</script>

<style type="text/scss" lang="scss" scoped>

</style>
